---
layout: base
---

<main class="container d-flex flex-nowrap col-xl-10 col-xxl-8 px-4 py-5 typechat-hero typechat-cap-content-width">
    <div class="row align-items-center g-lg-6 py-5">
        <div class="col-lg-6 col-xl-7 text-center text-lg-start">
            <h1 class="display-4 fw-bold lh-1 text-body-emphasis mb-3">TypeChat</h1>
            <p class="col-lg-10 fs-4">TypeChat helps get well-typed responses from language models to build
                pragmatic natural language interfaces.</p>
            <p class="col-lg-10 fs-4">All powered through your types.</p>
        </div>
        <div class="col-md-10 mx-auto col-lg-6 col-xl-5">
            <div class="p-4 p-md-4 border rounded-3 bg-body-tertiary">
                <a href="/docs/" class="mb-3 w-100 btn btn-lg btn-primary">Docs</a>
                <a href="https://github.com/microsoft/TypeChat" target="_blank" class="mb-2 w-100 btn btn-lg btn-primary">GitHub</a>
                <hr class="mb-4" />
                <div class="w-100 typechat-code-copy position-relative">
                    <button class="position-absolute d-none d-sm-block btn btn-dark" type="button" title="Copy 'npm install' command." aria-label=title="Copy 'npm install' command.">📋</button>
                    <code class="fs-5">npm install typechat</code>
                </div>
            </div>
        </div>
    </div>
</main>
